#include("/front/teacher/_layout.html")
#@layout()
#define layoutImportcss()
    <link rel="stylesheet" href="/front/css/framework7-icons.css">
#end
#define layoutHead()
<title>成员 - 班级首页</title>
#end
#define layoutHome()

	<div class="page-content people-page-content infinite-scroll-content">
	<div class="navbar">
		<div class="navbar-inner toolbstyle">
			<div class="left">
				<a href="javascript:window.location.href='/front/teacher/html/index'" class="link back">
					<i class="icon icon-back"></i>
				</a>
			</div>
			<div class="title">班级成员</div>
			<div class="right"></div>
		</div>
	</div>
		<div class="people-list">
			<div class="list" style="margin:35px 0 0 0">
				<ul id="ul_teachers">
				</ul>
			</div>
			<div class="list">
				<ul id="ul_students">
				</ul>
			</div>
		</div>                   
	</div>
#end
#define layoutImportjs()
#end
#define layoutScript()
<script type="text/javascript">
	
	sendPost('/front/teacher/students/getMembers', null, function(res){
		if (res.code == 200){
			if (isJsonProps(res, 'list_teachers')){
				bindTeachers(res.list_teachers);
			}
			if (isJsonProps(res, 'list_students')){
				bindStudents(res.list_students);
			}
		}else{
			alert(res.msg);
		}
	});
	
	function bindTeachers(list_data){
		var shtml = '<li class="list-group-title">老师（<span>'+list_data.length+'</span>人）</li>';
		for (var i = 0; i < list_data.length; i++) {
			var jdata = list_data[i];
			shtml += getTeachersHtml(jdata);
		}
		$$('#ul_teachers').append(shtml);
	}
	function bindStudents(list_data){
		var shtml = '<li class="list-group-title">学生（<span>'+list_data.length+'</span>人）</li>';
		for (var i = 0; i < list_data.length; i++) {
			var jdata = list_data[i];
			shtml += getStudenstHtml(jdata);
		}
		$$('#ul_students').append(shtml);
	}
	function getTeachersHtml(jdata){
		var lihtml = `
			<li>
				<a class="item-content ac-1">
					<div class="item-media">
						<span class="head-portrait people-head"><img src="${formatUserHeadImage(jdata.user_img)}"></span>
					</div>
					<div class="item-inner">
						<div class="item-title">
							<div class="name">${jdata.teacher_name}（${jdata.post_name}）</div>
							<div class="phone">${jdata.teacher_mobile}</div>
						</div>
						<div class="item-after">
							<i class="f7-icons" onclick="callTelphone('${jdata.teacher_mobile}')">phone_fill</i>
						</div>
					</div>
				</a>
			</li>
		`;
		return lihtml;
	}
	function getStudenstHtml(jdata){
		var lihtml = `
			<li>
				<a class="item-content ac-1">
					<div class="item-media" onclick="goStumain(${jdata.student_id})">
						<span class="head-portrait people-head"><img src="${formatUserHeadImage(jdata.student_headpic)}"></span>
					</div>
					<div class="item-inner">
						<div class="item-title" onclick="goStumain(${jdata.student_id})">${jdata.student_name}</div>
						<div class="item-after item-after-student">
							<i class="f7-icons" onclick="callTelphone('${jdata.student_mobile}')">phone_fill</i>
							<i class="f7-icons" onclick="window.location.href='/front/teacher/html/album?stuid=${jdata.student_id}'">images_fill</i>
							<i class="icon icon-next" onclick="goStumain(${jdata.student_id})"></i>
						</div>
					</div>
				</a>
			</li>
		`;
		return lihtml;
	}
	function goStumain(stuid){
		window.location.href='/front/teacher/html/stumain?stuid='+stuid;
	}
</script>
#end
